<html xmlns="http://www.w3.org/1999/xhtml" xmlns:c="http://java.sun.com/jstl/core"
      xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:t="http://myfaces.apache.org/tomahawk"
      xmlns:v="http://corejsf.com/validator">

    <f:view>
        <f:loadBundle var="text" basename="#{workOrderForm.bundleName}"/>
        <head>
            <title>#{text['workOrderDetail.title']}</title>
            <meta name="heading" content="#{text['workOrderDetail.heading']}"/>
            <meta name="menu" content="OperationMenu"/>
        </head>

        <div class="separator"></div>

        <h:form id="workOrderForm">
            <h:inputHidden value="#{workOrderForm.workOrder.id}" id="id"/>

            <h:panelGrid columns="3">

                <h:panelGroup styleClass="buttonBar right">
                    <h:commandButton value="#{text['button.save']}" action="#{workOrderForm.save}" id="save" styleClass="button"/>
                    <c:if test="${not empty workOrderForm.workOrder.id}">
                        <h:commandButton id="print" value="#{text['button.print']}"
                                     onclick="return printOrder('rpt_ordenes.rptdesign',#{workOrderForm.workOrder.id});"
                                     styleClass="button"/>
                        <c:if test="#{workOrderForm.workOrder.status != 'REMITIDA'}">
                        <h:commandButton value="#{text['button.remission']}" action="#{workOrderForm.generateRemission}"
                                     id="remission" immediate="true" styleClass="button"/>
                        </c:if>
                    </c:if>
                    <h:commandButton value="#{text['button.cancel']}" action="cancel" immediate="true"
                                     id="cancel" styleClass="button"/>
                </h:panelGroup>
                <h:outputText/><h:outputText/>

                <h:panelGroup>
                    <div>
                        <div class="left">
                            <h:outputLabel styleClass="desc" for="_id" value="#{text['workOrder.id']}"/>
                            <h:inputText styleClass="text medium" id="_id" value="#{workOrderForm.workOrder.id}" readonly="true"/>
                            <t:message for="_id" styleClass="fieldError"/>
                        </div>
                        <div>
                            <h:outputLabel styleClass="desc" for="quotation" value="#{text['workOrder.quotation']}"/>
                            <h:inputText styleClass="text medium" id="quotation" value="#{workOrderForm.workOrder.quotation.id}" readonly="true"/>
                            <t:message for="quotation" styleClass="fieldError"/>
                        </div>
                    </div>
                </h:panelGroup>

                <h:outputText/><h:outputText/>

                <h:outputLabel for="description" styleClass="desc" value="#{text['workOrder.description']}"/>
                <t:message for="description" styleClass="fieldError"/>
                <h:inputText value="#{workOrderForm.workOrder.description}" id="description" readonly="true" styleClass="text large">
                    <v:commonsValidator client="true" type="required" arg="#{text['workOrder.description']}"/>
                </h:inputText>

                <h:outputText/><h:outputText/>

                <h:panelGroup>
                    <div>
                        <div class="left">
                            <h:outputLabel styleClass="desc" for="receptionDate" value="#{text['workOrder.receptionDate']}"/>
                            <h:inputText styleClass="text medium" id="receptionDate" value="#{workOrderForm.workOrder.receptionDate}" readonly="true">
                                <f:convertDateTime pattern="dd/MM/yyyy"/>
                            </h:inputText>
                            <t:message for="receptionDate" styleClass="fieldError"/>
                        </div>
                        <div>
                            <h:outputLabel styleClass="desc" for="outputDate" value="#{text['workOrder.outputDate']}"/>
                            <h:inputText styleClass="text medium" id="outputDate" value="#{workOrderForm.workOrder.outputDate}" readonly="true">
                                <f:convertDateTime pattern="dd/MM/yyyy"/>
                            </h:inputText>
                            <t:message for="outputDate" styleClass="fieldError"/>
                        </div>
                    </div>
                </h:panelGroup>

                <h:outputText/><h:outputText/>

                <h:panelGroup>
                    <div>
                        <div class="left">
                            <h:outputLabel styleClass="desc" for="employee" value="#{text['workOrder.employee']}"/>
                            <h:inputText styleClass="text medium" id="employee" value="#{workOrderForm.workOrder.employee.firstName} #{workOrderForm.workOrder.employee.lastName}" readonly="true"/>
                            <t:message for="employee" styleClass="fieldError"/>
                        </div>
                        <div>
                            <h:outputLabel styleClass="desc" for="deliveryDate" value="#{text['workOrder.deliveryDate']}"/>
                            <h:inputText styleClass="text medium" id="deliveryDate" value="#{workOrderForm.workOrder.deliveryDate}" readonly="true">
                                <f:convertDateTime pattern="dd/MM/yyyy"/>
                            </h:inputText>
                            <t:message for="deliveryDate" styleClass="fieldError"/>
                        </div>
                    </div>
                </h:panelGroup>

                <h:outputText/><h:outputText/>

                <t:dataTable value="#{workOrderForm.workOrder.details}" var="detail" width="100%" id="_products"
                             styleClass="scrollerTable table">
                    <f:facet name="spacer">
                        <f:verbatim>&amp;#160;</f:verbatim>
                    </f:facet>
                    <t:column width="30%">
                        <f:facet name="header">
                            <t:outputText value="#{text['workOrderDetail.product.description']}"/>
                        </f:facet>
                        <t:outputText value="#{detail.quotationDetail.product.description}" rendered="#{detail.quotationDetail.product != null}"/>
                        <t:outputText value="#{detail.quotationDetail.itemDescription}" rendered="#{detail.quotationDetail.product == null}"/>
                    </t:column>
                    <t:column width="30%">
                        <f:facet name="header">
                            <t:outputText value="#{text['workOrderDetail.status']}"/>
                        </f:facet>
                        <t:outputText value="#{detail.status.name}"/>
                    </t:column>
                </t:dataTable>

                <h:outputText/><h:outputText/>

                <h:outputLabel for="notes" styleClass="desc" value="#{text['workOrder.notes']}"/>
                <t:message for="notes" styleClass="fieldError"/>
                <h:inputText value="#{workOrderForm.workOrder.notes}" id="notes" styleClass="text large">
                </h:inputText>
            </h:panelGrid>
            <t:saveState id="save1" value="#{workOrderForm.workOrder}"/>
        </h:form>

        <script type="text/javascript">
            Form.focusFirstElement($('workOrderForm'));
            highlightFormElements();
        </script>
        <script type="text/javascript">
            function printOrder(report, id){
                window.open('/birt-viewer/run?__report=' + report + '&amp;rp_orden_id=' + id + '__format=html','SuArte','height=700,width=800,status=yes,toolbar=no,menubar=yes,location=no,resizable=yes');
                return false;
            }
        </script>
    </f:view>
</html>